// 最多显示一行的文字，多余的内容会被省略。使用直接用ellipsis类名即可
.ellipsis() {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

// 垂直居中
.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}
// 背景
// 传进一个值的时候，就是传背景图 默认背景的background-size是100%，
// 两个值的时候代表着此时的背景图宽高比例相同
.Bg(@bg, @x:100%) {
  background: url('@{bg}') no-repeat center center;
  background-size: @x @x;
}
// 如果传进来三个值，第一个值是背景图，第二个是宽度的百分比，第三个是高度的百分比
.Bg(@bg, @x, @y) {
  background: url('@{bg}') no-repeat center center;
  background-size: @x @y;
}
// 宽高
// 传入两个值的时候，第一个参数是宽，第二个参数是高
.WH (@w, @h) {
  width: @w;
  height: @h;
}
// 传入一个值的时候，默认宽高相同，传进的值是宽高
.WH (@w) {
  width: @w;
  height: @w;
}

:root {
  --android-bottom: 12px;
}

/* iPhoneX/iPhoneXs/iPhone11 Pro / 13 mini/12 mini */
/* iPhoneXs Max/iPhone11 Pro Max // iPhoneXR/iPhone11 */
/* 13 /13 Pro/12 Pro /14 */
/* 13 Pro Max/12 Pro Max */
/* iPhone SE 3rd gen */
/* 14Pro / 15 / 15 Pro / 16 */
/* 14 Pro Max / 15 Plus / 15 Pro Max / 16 Plus */
/* 16 Pro */
/* 16Pro */
/* 16Pro Max */
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3),
  only screen and (device-width: 414px) and (device-height: 896px),
  only screen and (device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3),
  only screen and (device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3),
  only screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2),
  only screen and (device-width: 393px) and (device-height: 852px) and (-webkit-device-pixel-ratio: 3),
  only screen and (device-width: 430px) and (device-height: 932px) and (-webkit-device-pixel-ratio: 3),
  only screen and (device-width: 402px) and (device-height: 874px) and (-webkit-device-pixel-ratio: 3),
  only screen and (device-width: 440px) and (device-height: 956px) and (-webkit-device-pixel-ratio: 3) {
  :root {
    --android-bottom: 0;
  }
}
